import 'dart:async';

import 'package:eyepetizer_example/model/common_item.dart';
import 'package:eyepetizer_example/page/video/video_detail_page.dart';
import 'package:eyepetizer_example/widget/go_navigation.dart';
import 'package:flutter/material.dart';

import '../../utils/cache_image.dart';
import '../../viewmodel/home_page_viewmodel.dart';

class BannerWidget extends StatefulWidget {
  final HomePageViewModel model;

  const BannerWidget({Key? key, required this.model}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _BannerWidgetState();
  }
}


class _BannerWidgetState extends State<BannerWidget> {

  late PageController pageController;
  late Timer _playPageTimer;
  int _pageIndex = 0;

  @override
  void initState() {
    super.initState();
    pageController = PageController();
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      _startPageTimer();
    });
  }

  void _startPageTimer() {
    int bannerSize = widget.model.bannerList.length;
    _playPageTimer = Timer.periodic(const Duration(milliseconds: 3000), (value){
      if(_pageIndex < bannerSize-1) {
        _pageIndex ++;
      }else {
        _pageIndex = 0;
      }

      pageController.animateToPage(_pageIndex,
          duration: const Duration(milliseconds: 200),
          curve: Curves.ease);

    });
  }

  @override
  void dispose() {
    super.dispose();
    _playPageTimer.cancel();
  }

  @override
  Widget build(BuildContext context) {
    return PageView(
      controller: pageController,
      children: widget.model.bannerList.map((item) => getBannerItem(context, item)).toList(),
    );
    // return ListView(
    //   scrollDirection: Axis.horizontal,
    //   children:
    //   model.bannerList.map((item) => getBannerItem(context, item)).toList(),
    // );
  }


  Widget getBannerItem(BuildContext context, ItemList item) => Stack(
    children: <Widget>[
      GestureDetector(
        onTap: (){
          if(item.data == null) {
            return;
          }
          GoNavigator.toPage(context, VideoDetailPage(item.data!));
        },
        child: Container(
          width: MediaQuery.of(context).size.width,
          // decoration:装饰,设置子控件的背景颜色、形状等
          decoration: BoxDecoration(
            image: DecorationImage(
              // 网络获取图片
              image: cachedNetworkImageProvider(item.data?.cover?.feed ?? ""),
              // 图片显示样式,类似Android缩放设置
              fit: BoxFit.cover,
            ),
          ),
        ),
      ),
      // banner底部透明黑条
      Positioned(
        // 默认显示内容宽度
        width: MediaQuery.of(context).size.width - 30,
        // 放于底部
        bottom: 0,
        child: Container(
          padding: const EdgeInsets.fromLTRB(15, 10, 0, 10),
          // decoration:装饰,设置子控件的背景颜色、形状等
          decoration: const BoxDecoration(color: Colors.black12),
          child: Text(
            item.data?.title ?? "",
            style: const TextStyle(color: Colors.white, fontSize: 12),
          ),
        ),
      )
    ],
  );

}


